import {computed} from "vue";
import {MODULES, useSettingStore} from "@/stores/modules/setting.js";
import {backgroundTypes} from "@/enums/background-type";
import {notification} from "ant-design-vue";

// 动效配置
const attrMap = {
    snow: {
        maxSnowRadius: 10,
        maxSnowVx: 2,
        maxSnowVy: 2,
        maxSnowCount: 50,
    },
    bubble: {
        bubbleCount: 30,
        maxBubbleRadius: 2,
        maxBubbleSpeed: 1,
        minBubbleSpeed: 0.5,
    },
};

export function useBackground() {
    const settingStore = useSettingStore();

    const effect = computed(() => settingStore.backgroundEffect);
    const backgroundType = computed(() => settingStore.backgroundType);

    // 动态背景组件
    const dynamicBackground = computed(() => {
        const type = backgroundType.value || 0;
        const key = type in backgroundTypes ? type : 0; // 类型检查，防止非法索引
        return "background-" + backgroundTypes[key as keyof typeof backgroundTypes];
    });

    // 更新背景
    const updateBackground = (type: number, pic: { src: string }) => {
        settingStore.updateSetting({ module: MODULES.BACKGROUND, key: "type", value: type });
        settingStore.updateSetting({
            module: MODULES.BACKGROUND,
            key: type === 1 ? "staticSrc" : "dynamicSrc",
            value: pic.src,
        });
        notification.success({ message: "更换背景成功" });
    };

    // 更新动效
    const updateEffect = (value: string) => {
        settingStore.updateSetting({ module: MODULES.BACKGROUND, key: "effect", value });
    };

    return {
        settingStore,
        effect,
        backgroundType,
        dynamicBackground,
        updateBackground,
        updateEffect,
        attrMap
    };
}